<template>
  <div>
    <div class="content">
      <div class="left-bd">
        <div class="info" v-if="isShowStatus">
          你的 BMI 值: {{ currentData.bmi }}，身体状态：{{ currentData.status }}
        </div>
        <form @submit.prevent="handleSubmit">
          <div class="box">
            <div class="msg">
              <span>我的身高:</span>
              <input type="text" id="h" v-model="formData.height">单位: 厘米 cm
            </div>
            <div class="msg">
              <span>我的体重:</span>
              <input type="text" id="w" v-model="formData.weight">单位: 千克 kg
            </div>

            <button>提交</button>

          </div>
        </form>
      </div>

    </div>

  </div>
</template>

<script>
export default {
  name: "BMIFormComponent",
  props: {
    currentData: {
      type: Object,
      default: () => ({})
    },
    isShowStatus: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      // isShowStatus: false,
      formData: {
        height: '',
        weight: ''
      }
    }
  },
  methods: {
    handleSubmit() {

      this.$emit('emit-bmi', this.formData)
    }
  }
}
</script>

<style scoped>



</style>